
<link rel="stylesheet" href="assets/common/plugins/umeditor/themes/default/css/umeditor.css">
<div class="row-content am-cf">
    <div class="row">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
            <div class="widget am-cf">
                <form id="my-form" class="am-form tpl-form-line-form" method="post">
                    <div class="widget-body">
                        <fieldset>
                            <div class="widget-head am-cf">
                                <div class="widget-title am-fl">基本信息</div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">视频标题 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <input type="text" class="tpl-form-input" name="video[video_name]"
                                           value="" required>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">副标题 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <input type="text" class="tpl-form-input" name="video[subtitle]"
                                           value="" required>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">分类 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <select name="video[category_id]" required
                                            data-am-selected="{searchBox: 1, btnSize: 'sm',
                                             placeholder:'请选择分类', maxHeight: 400}">
                                        <option value=""></option>
                                        <?php if (isset($catgory)): foreach ($catgory as $item): ?>
                                            <option value="<?= $item['category_id'] ?>"><?= $item['name'] ?></option>
                                        <?php endforeach; endif; ?>
                                    </select>
                                    <small class="am-margin-left-xs">
                                        <a href="<?= url('movies.video.category/add') ?>">去添加</a>
                                    </small>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">观看等级 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <select name="video[grade_id]" required
                                            data-am-selected="{searchBox: 1, btnSize: 'sm',
                                             placeholder:'请选择最低观看等级', maxHeight: 400}">
                                        <option value="0">无限制</option>
                                        <?php if (isset($grade)): foreach ($grade as $item): ?>
                                            <option value="<?= $item['grade_id'] ?>"><?= $item['name'] ?></option>
                                        <?php endforeach; endif; ?>
                                    </select>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">封面图片 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <div class="am-form-file">
                                        <div class="am-form-file">
                                            <button type="button"
                                                    class="upload-file am-btn am-btn-secondary am-radius">
                                                <i class="am-icon-cloud-upload"></i> 选择图片
                                            </button>
                                            <div class="uploader-list am-cf">
                                            </div>
                                        </div>
                                        <div class="help-block am-margin-top-sm">
                                            <small>尺寸750x750像素以上，大小2M以下 (可拖拽图片调整显示顺序 )</small>
                                        </div>
                                    </div>
                                </div>
                            </div>

<!--                            <div class="layui-form-item" style="width:200%;">-->
<!--                                <label class="layui-form-label">视频</label>-->
<!--                                <div>-->
<!--                                    <video controls='controls' style="margin-top: 10px;max-width: 200px;width: 100%;">-->
<!--                                        <source src="goods_video" type='video/mp4' id="video">-->
<!--                                    </video>-->
<!--                                    <p>-->
<!--                                        <input type="text" name="room[goods_video]" id="input1" style="display: none" value="">-->
<!--                                        <button style="margin-left:110px;" type="button" class="layui-btn"-->
<!--                                                id="video_upload_btn">上传视频-->
<!--                                        </button>-->
<!--                                        <span style="color:brown">（支持AVI、mp4、wma、rm、rmvb、flash、mid、3GP格式）</span>-->
<!--                                    </p>-->
<!--                                </div>-->
<!--                            </div>-->

                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">初始播放量 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <input type="number" min="1" max="100" class="tpl-form-input" name="video[paly_num]" value="1"
                                           required>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">总集数 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <input type="number" min="1" max="100" class="tpl-form-input" name="video[total_num]" value="1"
                                           required>
                                </div>
                            </div>
                            <div class="am-form-group am-padding-top">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label"> 视频简介 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <textarea class="am-field-valid" rows="5" placeholder="请输入视频简介"
                                              name="video[content]"></textarea>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">视频状态 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <label class="am-radio-inline">
                                        <input type="radio" name="video[video_status]" value="10" data-am-ucheck
                                               checked>
                                        上架
                                    </label>
                                    <label class="am-radio-inline">
                                        <input type="radio" name="video[video_status]" value="20" data-am-ucheck>
                                        下架
                                    </label>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">排序 </label>
                                <div class="am-u-sm-9 am-u-end">
                                    <input type="number" class="tpl-form-input" name="video[video_sort]"
                                           value="100" required>
                                    <small>数字越小越靠前</small>
                                </div>
                            </div>
                            <!-- 表单提交按钮 -->
                            <div class="am-form-group">
                                <div class="am-u-sm-9 am-u-sm-push-3 am-margin-top-lg">
                                    <button type="submit" class="j-submit am-btn am-btn-secondary">提交
                                    </button>
                                </div>
                            </div>

                        </fieldset>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- 图片文件列表模板 -->
{{include file="layouts/_template/tpl_file_item" /}}

<!-- 文件库弹窗 -->
{{include file="layouts/_template/file_library" /}}

<script src="assets/common/js/vue.min.js"></script>
<script src="assets/common/js/ddsort.js"></script>
<script src="assets/common/js/plupload.full.min.js"></script>
<script src="assets/common/plugins/umeditor/umeditor.config.js?v=<?= $version ?>"></script>
<script src="assets/common/plugins/umeditor/umeditor.min.js"></script>
<script src="assets/store/js/goods.spec.js?v=<?= $version ?>"></script>
<script>

    //上传视频
    var goods_video = '';
    $(function () {
        var uploader_video = new plupload.Uploader({
            browse_button: 'video_upload_btn', // 上传按钮
            url: "/index.php?s=store/upload/video", //远程上传地址
            filters: {
                max_file_size: '100mb', //最大上传文件大小（格式100b, 10kb, 10mb, 1gb）
                mime_types: [//允许文件上传类型
                    {title: "iFile", extensions: "mpg,m4v,mp4,flv,3gp,mov,avi,rmvb,mkv,wmv"}
                ]
            },
            chunk_size: "0", //分片上传文件时，每片文件被切割成的大小，为数字时单位为字节。也可以使用一个带单位的字符串，如"200kb"。当该值为0时表示不使用分片上传功能
            multi_selection: false, //true:ctrl多文件上传, false 单文件上传
            init: {
                FilesAdded: function(up, files) { //文件上传前
                    plupload.each(files, function (file1) {
                        uploader_video.start();
                    });
                },
                UploadProgress: function(up, file) { //上传中，显示进度条
                    $('#Progress').css('width', file.percent+'%');
                },
                FileUploaded: function(up, file, info) { //文件上传成功的时候触发
                    var response = $.parseJSON(info.response);
                    if (response.error == 0) {
                        layer.msg('视频上传成功！');
                        setTimeout(function () {
                            var url = response.url;
                            $("#video").show().attr("src", url);
                            $("#video").parent().get(0).load();
                            $("#input1").val(url)
                            goods_video = url;
                        }, 1000);
                    }
                    else {
                        layer.msg(response.message);return false;
                    }
                },
                Error: function(up, errObject) { //上传出错的时候触发
                    alert('上传错误！');
                }
            }
        });
        uploader_video.init();
    });

    $(function () {

        // 富文本编辑器
        UM.getEditor('container', {
            initialFrameWidth: 375 + 15,
            initialFrameHeight: 600
        });

        // 选择图片
        $('.upload-file').selectImages({
            name: 'video[images][]'
            , multiple: true
        });

        // 图片列表拖动
        $('.uploader-list').DDSort({
            target: '.file-item',
            delay: 100, // 延时处理，默认为 50 ms，防止手抖点击 A 链接无效
            floatStyle: {
                'border': '1px solid #ccc',
                'background-color': '#fff'
            }
        });

        /**
         * 表单验证提交
         * @type {*}
         */
        $('#my-form').superForm({
        });


    });
</script>
